<template>
  <div v-loading="loading">
    <van-nav-bar
        title="添加视频"
        left-text="返回"
        right-text=" "
        left-arrow
        @click-left="onClickLeft"
    />

    <van-form @submit="onSubmit">
      <van-field
          v-model="formData.title"
          name="标题"
          label="标题"
          placeholder="请输入视频标题"
          :rules="[{ required: true, message: '请输入视频标题' }]"
      />
      <van-field
          v-model="formData.content"
          rows="5"
          autosize
          type="textarea"
          name="概要"
          label="概要"
          placeholder="请简单描述视频内容"
          :rules="[{ required: true, message: '请简单描述视频内容' }]"
      />
      <van-field
          v-model="formData.url"
          name="地址"
          label="地址"
          type="textarea"
          rows="2"
          autosize
          placeholder="请输入视频地址"
          :rules="[{ required: true, message: '请输入视频地址' }]"
      />
      <div style="margin: 16px;">
        <van-button round block type="info" native-type="submit">提交</van-button>
      </div>
    </van-form>
  </div>
</template>

<script>
import {Dialog, Toast} from "vant";
import {request} from "@/assets/js/utils/request";

export default {
  name: "add",
  data(){
    return{
      loading:false,
      formData:{}
    }
  },
  methods:{
    onClickLeft(){
      this.$router.push('/home')
    },
    onSubmit(){
        Dialog.confirm({
          title: '提示',
          message:
              '是否添加视频？',
        })
            .then(() => {
              this.loading = true ;
              request('/rest/cdweb2/addVideo', "post", this.formData).then(res=>{
                if (res.code==0){
                  Toast.success('添加成功');
                  this.onClickLeft() ; //返回
                  this.show = false
                }else{
                  Toast.fail('添加失败');
                }
                this.loading = false ;
              })
            })
            .catch(() => {
              this.loading = false ;
            });
      },
  }
}
</script>

<style scoped>

</style>